<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>jQuery 代码演示</title>
    <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>

</head>

<body>
    <div id="app">
        <ul id="list">
            <li>第1条数据</li>
            <li>第2条数据</li>
        </ul> 
        <button id="add">添加数据</button>
    </div>

    <script>
        $(document).ready(function () {
            var i = 2; 
            $('#add').click(function () {
                i++; //通过 DOM 操作在最后一个li元素后手动添加一个标签
                $("#list").children("li").last().append("<li>第" + i + "条数据</li>");
            });
        }); 
    </script>
</body>

</html>